import React, {Component} from 'react';
import storageUtil from "../../../utils/storageUtil";
import {List, Avatar, Button, message} from 'antd';
import { Modal} from 'antd';

class MakingOrder extends Component {

    state={
        orders:'',
        visible:false,
        confirmLoading:false,
        modalText:'请输入问题'
    }

    componentDidMount() {
        const uid = storageUtil.getUser().uid
        this.$myAxios.get('/order/showMyMakingOrder/'+uid).then(res => {
            console.log(res.data)
            this.setState({
                orders: res.data
            })
        })

    }



    render() {

        const handleOk = () => {
            this.setState({modalText:'输入问题'})
            this.setState({confirmLoading:true})
            const question = this.input.value
            if(question){
                const q={
                    'oid': storageUtil.getOrder().oid,
                    'uid': storageUtil.getUser().uid,
                    'question': question
                }
                console.log(q)
                this.$myAxios.post("/question/addQuestion",q).then(res => {
                    if(res.data){
                        message.success("添加成功")
                    }
                })
            }
            else
                message.error('问题不能为空')
            setTimeout(() => {
                this.setState({visible:false})
                this.setState({confirmLoading:false})
            }, 2000);
        };

        const handleCancel = () => {
            console.log('Clicked cancel button');
            this.setState({visible:false})
        };

        return(
            <List
                itemLayout="horizontal"
                dataSource={this.state.orders}
                renderItem={item => (
                    <List.Item>
                        <List.Item.Meta
                            avatar={<Avatar src="/static/image/order.png" />}
                            title={<a href="https://ant.design">{item.theme}</a>}
                            description={"创建时间："+item.createtime}
                        />


                            <Button type="primary" onClick={ () =>
                            {
                                this.setState({visible:true})
                                storageUtil.saveOrder(item)
                                console.log(item)
                            }
                            }>
                                追加
                            </Button>
                            <Modal
                                title="追加工单"
                                visible={this.state.visible}
                                okText={'确认'}
                                cancelText={'取消'}
                                onOk={handleOk}
                                confirmLoading={this.state.confirmLoading}
                                onCancel={handleCancel}
                            >
                                <p>{this.state.modalText}
                                <input
                                    ref={input => this.input = input}
                                />
                                </p>
                            </Modal>

                        <Button
                            onClick={()=>{
                                console.log(item)
                                storageUtil.saveOrder(item)
                                this.props.history.push("/admin/qa")
                                console.log(storageUtil.getOrder())
                            }}
                            style={{marginLeft: '10px'}}
                            type="primary"
                        >
                            详细信息
                        </Button>

                        <Button
                            style={{marginLeft: '10px'}}
                            danger
                            type="primary"
                            onClick={()=>{
                                storageUtil.saveOrder(item)
                                const oid = storageUtil.getOrder().oid
                                this.$myAxios.get("/order/finishOrder/"+oid).then(res=>{
                                    console.log(res.data)
                                    if(res.data){
                                        message.success("修改成功")
                                        window.location.reload()
                                    }
                                    else
                                        message.error("修改失败")
                                })
                            }}
                        >
                            完结工单
                        </Button>


                    </List.Item>
                )}
            />
        )
    }
}

export default MakingOrder;